<template>
	<view>
		<view class="" style="height: 70px;"> </view>
		<view style="width: 100%;height: 70px;position: fixed; bottom: 0;background-color: #fff;display: flex;justify-content: space-around;
		align-items: center;">
			<view v-for="v in list" class="com_tab" @click="tab(v.url)">
				<image :src="v.state===0?v.img:v.img1" style="width: 30px;height: 30px;"></image>
				<view style="font-size: 14px;">{{v.label}}</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			url: String
		},
		data() {
			return {
				list: [],
			}
		},
		methods: {
			tab(item) {
				uni.navigateTo({
					url: item
				})
			},
		},
		created() {
			this.$ajax('get', 'recovery/user/profile').then((res) => {
				if (res.data.user.recyclerType == 1) {
					this.list = [{
						img: '../../static/img/jiedan.png',
						img1: '../../static/img/jiedan_light.png',
						url: '/pages/index/index',
						state: 0,
						id: 1,
						label: '接单'
					}, {
						img: '../../static/img/jiedan.png',
						img1: '../../static/img/jiedan_light.png',
						url: '/pages/index/Recallslip',
						state: 0,
						id: 2,
						label: '回收单'
					}, {
						img: '../../static/img/me.png',
						img1: '../../static/img/me_light.png',
						url: '/pages/my/mycopy',
						state: 0,
						id: 3,
						label: '我的'
					}, ]
				} else {
					this.list = [{
						img: '../../static/img/saoma.png',
						img1: '../../static/img/saoma_light.png',
						url: '/pages/index/scanCode',
						state: 0,
						id: 1,
						label: '扫码'
					}, {
						img: '../../static/img/jiedan.png',
						img1: '../../static/img/jiedan_light.png',
						url: '/pages/index/RecallslipSa',
						state: 0,
						id: 2,
						label: '回收单'
					}, {
						img: '../../static/img/me.png',
						img1: '../../static/img/me_light.png',
						url: '/pages/my/mycopy',
						state: 0,
						id: 3,
						label: '我的'
					}, ]
				}
				this.list.forEach((v) => {
					if (v.url === this.url) {
						this.$set(v, 'state', v.state === 1 ? 0 : 1);
					} else {
						this.$set(v, 'state', 0);
					}
				})
			})
		}
	}
</script>

<style>
	.com_tab {
		display: flex;
		flex-direction: column;
		align-items: center;
	}
</style>